<template>
	<view class="center">
		<hea-ders title="职员选择">
			<image slot='left' src="@/static/images/arrow_left.png" mode="widthFix" @click="back"></image>
			<view class="ima" slot='official' @click="Sizer">
				<text>清除</text>
			</view>
		</hea-ders>
		<view class="seach">
			<!-- <image class="search_d" src="@/static/images/search.png" mode="widthFix"></image> -->
			<input type="text" value="" placeholder="客户名称"  @click="flagi =!flagi"/>
			<view class="seach_con" v-if="flagi">
				<text style="margin-right: 20rpx;">18511111111</text>
				<text>00001</text>
			</view>
		</view>
	</view>
</template>

<script>
	import heaDers from '@/pages/header/header.vue'
	export default {
		components:{
			heaDers
		},
		data() {
			return {
				flag:true,
				flagi:false
			}
		},
		methods: {
			back(){
				uni.navigateBack({
					delta:1
				})
			},
			Sizer(){
				uni.navigateTo({
					url:'../record/record'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.center {
	width: 100%;
	height: 100vh;
	box-sizing: border-box;
	background: rgba(245, 245, 245, 1);

	.title {
		width: 100%;
		height: 88rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		background-color: rgba(36, 153, 246, 1);
		display: flex;
		justify-content: space-between;
		align-items: center;
		image {
			width: 22rpx;
		}
	
		text {
			font-size: 36rpx;
			color: #fff;
			font-weight: 400;
			font-family: PingFang SC;
		}
	
		.ima {
			text {
				font-size:30rpx;
				font-family:PingFang SC;
				font-weight:500;
				line-height:33rpx;
				color:rgba(255,255,255,1);
				opacity:1;
			}
			image {
				width: 40rpx;
				margin-left: 5rpx;
			}
		}
	}
	.seach {
		width: 100%;
		background: #fff;
		padding: 10rpx 30rpx;
		box-sizing: border-box;
		position: relative;
		.search_d {
			width: 40rpx;
			position: absolute;
			left: 8%;
			top: 15%;
		}
		input {
			width: 100%;
			height: 64rpx;
			background-color: rgba(245, 245, 245, 1) !important;
			border-radius: 32rpx;
			padding-left: 80rpx;
			box-sizing: border-box;
			background: url(@/static/images/search.png) no-repeat ;
			background-position:5% 50% ;
			background-size:6% ;
			 
		}
		
		.seach_con {
			border-bottom: 1rpx solid #e0e0e0;
			width: 100%;
			height: 64rpx;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			
			.ims {
			display: inline-block ;
			width: 40rpx;
			margin-right: 30rpx;
			}
			text {
				font-size:20rpx;
				font-family:PingFang SC;
				font-weight:500;
				line-height:28rpx;
				color:rgba(117,117,117,1);
				opacity:1;
			}
		}
		.seach_con:last-child{border-bottom:none;}
	}
}
</style>
